<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/static/commons/taglibs.jsp"%>
<%@ include file="/static/commons/meta.jsp"%>
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 	<title>${title }</title>
	<!--自定义index样式-->
	<link rel="stylesheet" href="${ctx }/static/styles/basic/basic.css" />
	<link rel="stylesheet" href="${ctx }/static/styles/edit/box.css" />
	<!--js库-->
	<%@ include file="/static/commons/jquery-easyui.jsp" %>
	<script language="JavaScript" src="${ctx}/static/widgets/easyui/plugins/jquery.draggable.js"></script>
	<script language="JavaScript" src="${ctx}/static/widgets/easyui/plugins/jquery.droppable.js"></script>
	<script language="JavaScript" src="${ctx}/static/widgets/easyui/plugins/jquery.tree.js"></script>
	<script language="JavaScript" src="${ctx}/static/scripts/set_select.js"></script>
	<script language="JavaScript" src="${ctx}/static/scripts/common.js"></script>
	<script language="javascript"src="${ctx}/static/scripts/WdatePicker/WdatePicker.js"></script>
	<style>
		.message {
		    width: 80px;
		    background: rgb(241, 241, 241);
		    text-align: right;
		    padding-right: 5px;
		}
		.equDiv .message {
		    width: 80px;
		    background: rgb(241, 241, 241);
		    text-align: center;
		    padding: 5px;
		}
		
		.add_icon{
			background: url(${ctx}/static/images/common/plus_minus.jpg) left 0px no-repeat;		
			width: 14px;
			height: 14px;
			cursor: pointer;	
		}
		.del_icon{
			background: url(${ctx}/static/images/common/plus_minus.jpg) right 0px no-repeat;
			width: 14px;
			height: 14px;
			cursor: pointer;		
		}
		
		.equDiv table tr td:FIRST-CHILD{
			width: 30px;
			padding: 0px;
			text-align: center;
		}
		.equDiv table tr td:nth-child(7){
			width: 35px;
			padding: 0px;
		}
	</style>
  </head>
  
  <body style="padding-bottom:8px;">
  		<c:set var="em" value="<span>*</span>"></c:set>
  		<c:set var="disabled" value=""></c:set>
  		<c:set var="ifSelect" value=""></c:set>
  		<c:set var="noChange" value=""></c:set>
  		<c:set var="isImportant" value="true"></c:set>
  		<c:if test="${not empty view}">
  			<c:set var="disabled" value="disabled"></c:set>
  			<c:set var="ifSelect" value="false"></c:set>
  			<c:set var="em" value=""></c:set>
  			<c:set var="isImportant" value=""></c:set>
  		</c:if>
  		<c:if test="${not empty role.user_id}">
	  		<c:set var="noChange" value="disabled"></c:set>
  		</c:if>
  		<form id="editForm" action="${ctx}/buyApply/save" method="post">
  			<input type="hidden" value="${obj.buy_id}" id="buyId" name="p_buyId" />
  			<div class="box">
  				<div>
  					<label style="font-size: 16px;font-weight: 700;">采购申请单</label>
  				</div>
  				<div>
  					<label style="float: right;">
  						序号：${not empty obj.buy_id?obj.log_code:'系统自动生成'}
  					</label>
  					<label style="float: right;margin-right: 15px;">
  						编号：${not empty obj.buy_id?obj.buy_code:'系统自动生成'}
					</label>
  				</div>
	  			<table cellspacing="0" cellpadding="0">
	  				<tbody>
						<tr>
							<td class="message">
								<p><span>*</span>用途：</p>
							</td>
							<td>
								<vvise:select id="buyUse" name="p_buyUse" sqlname="getCodeData" className="wd170" width="99%"
									 sqlparam="use_to" ifSelect="${ifSelect}" defval="${obj.buy_use }" onchange="showCust(this.value)" />
							</td>
							<td class="message">
								<p>申请人：</p>
							</td>
							<td>
								${not empty obj ? obj.buy_user_name : LoginUser.userName }
							</td>
							<td class="message">
								<p>申请时间：</p>
							</td>
							<td colspan="3">
								<c:if test="${empty obj }">${reqDate }</c:if>
								<c:if test="${not empty obj }"><fmt:formatDate value="${obj.req_date }" pattern="yyyy-MM-dd HH:mm:ss"/></c:if>
								<input type="hidden" name="p_reqDate" value="${reqDate }" />
							</td>
						</tr>
						<tr>
							<td class="message">
								<p><span>*</span>供应商名称：</p>
							</td>
							<td colspan="1">
								<input type="text" id="supplier" name="p_supplier" value="${obj.supplier }"
									class="wd170 " ${disabled } maxLength="32" style="width: 100%;" />
							</td>
							<td class="message">
								<p><span>*</span>供应商地址：</p>
							</td>
							<td colspan="1">
								<input type="text" id="supplierAddr" name="p_supplierAddr" value="${obj.supplier_addr }"
									class="wd170 " ${disabled } maxLength="64" style="width: 100%;" />
							</td>
							<td class="message">
								<p><span>*</span>联系人：</p>
							</td>
							<td colspan="1">
								<input type="text" id="supplierLinkman" name="p_supplierLinkman" value="${obj.supplier_linkman }"
									class="wd170 " ${disabled } maxLength="20" style="width: 100%;" />
							</td>
							<td class="message">
								<p><span>*</span>联系电话：</p>
							</td>
							<td colspan="1">
								<input type="text" id="supplierPhone" name="p_supplierPhone" value="${obj.supplier_phone }"
									class="wd170 " ${disabled } maxLength="20" style="width: 100%;" />
							</td>
						</tr>
						<tr>
							<td class="message">
								<p><span>*</span>到货日期：</p>
							</td>
							<td colspan="1">
								<input type="text" id="arriveDate" name="p_arriveDate" value="<fmt:formatDate value="${obj.arrive_date }" pattern="yyyy-MM-dd"/>"
									class="Wdate wd170" ${disabled } style="width: 100%;" onFocus="WdatePicker()" />
							</td>
							<td class="message">
								<p><span>*</span>申请理由：</p>
							</td>
							<td colspan="5">
								<input type="text" id="applyReason" name="p_applyReason" value="${obj.apply_reason }"
									class="wd170 " ${disabled } maxLength="64" style="width: 100%;" />
							</td>
						</tr>
						<tr id="custTr"  <c:if test="${obj.buy_use ne 2}">style="display: none;"</c:if> >
							<td class="message">
								<p><span>*</span>客户单位：</p>
							</td>
							<td colspan="1">
								<input type="text" id="customer" name="p_customer" value="${obj.customer }"
									class="wd170 " ${disabled } maxLength="32" style="width: 100%;" />
							</td>
							<td class="message">
								<p><span>*</span>客户地址：</p>
							</td>
							<td colspan="1">
								<input type="text" id="custAddr" name="p_custAddr" value="${obj.cust_addr }"
									class="wd170 " ${disabled } maxLength="64" style="width: 100%;" />
							</td>
							<td class="message">
								<p><span>*</span>联系人：</p>
							</td>
							<td colspan="1">
								<input type="text" id="custLinkman" name="p_custLinkman" value="${obj.cust_linkman }"
									class="wd170 " ${disabled } maxLength="20" style="width: 100%;" />
							</td>
							<td class="message">
								<p><span>*</span>联系电话：</p>
							</td>
							<td colspan="1">
								<input type="text" id="custPhone" name="p_custPhone" value="${obj.cust_phone }"
									class="wd170 " ${disabled } maxLength="20" style="width: 100%;" />
							</td>
						</tr>
					</tbody>	
	  			</table>
	  			<div class="equDiv" style="height: 200px;overflow: auto; margin-top: -1px;">
		  			<table cellspacing="0" cellpadding="0">
		  				<tbody id="equTable">
							<tr>
								<td class="message">
									<p>序号</p>
								</td>
								<td class="message">
									<p>采购产品名称</p>
								</td>
								<td class="message">
									<p>型号</p>
								</td>
								<td class="message">
									<p>数量</p>
								</td>
								<td class="message">
									<p>单价</p>
								</td>
								<td class="message">
									<p>总价</p>
								</td>
								<c:if test="${empty view}">
									<td class="message">
										<div class="add_icon" title="添加产品" onclick="addPro()"></div>
									</td>
								</c:if>
							</tr>
							<c:forEach items="${details}" var="v" varStatus="i">
								<tr id="tr_${i.count }" class="proClass" idx="${i.count }">
									<td>
										<label id="xuhao_${i.count }" style="font-weight: 700;text-align: center;">${i.count }</label>
									</td>
									<td>
										<input type="text" id="productName_${i.count }" name="productName" value="${v.product_name }"
											class="wd170 " ${disabled } maxlength="32" style="width: 100%;" />
									</td>
									<td>
										<input type="text" id="model_${i.count }" name="model" value="${v.model }"
											class="wd170 " ${disabled } maxlength="32" style="width: 100%;" />
									</td>
									<td>
										<input type="text" id="num_${i.count }" name="num" onkeyup="getTotal(${i.count })" value="${v.num }"
											class="wd170 " ${disabled } maxlength="32" style="width: 100%;" />
									</td>
									<td>
										<input type="text" id="unitPrice_${i.count }" name="unitPrice"  onkeyup="getTotal(${i.count })" value="${v.unit_price }"
											class="wd170 " ${disabled } maxlength="64" style="width: 100%;" />
									</td>
									<td>
										<label id="total_${i.count }">${v.num * v.unit_price }</label>
									</td>
									<c:if test="${empty view}">
										<td>
											<div class="del_icon" title="移除仪器" onclick="delPro(${i.count })"></div>
										</td>
									</c:if>
								</tr>
							</c:forEach>
						</tbody>
		  			</table>
	  			</div>
	  		</div>
        </form>
        <script type="text/javascript">
        	var proI = ${fn:length(details)+1};
        	function addPro(){        		
        		var _html = '';
        		_html += '<tr id="tr_'+ proI +'" class="proClass" idx="'+ proI +'">\
					<td>\
						<label id="xuhao_'+ proI +'" style="font-weight: 700;text-align: center;">'+ proI +'</label>\
					</td>\
					<td>\
						<input type="text" id="productName_'+ proI +'" name="productName" value="${obj.product_name }"\
							class="wd170 " ${disabled } maxlength="32" style="width: 100%;" />\
					</td>\
					<td>\
						<input type="text" id="model_'+ proI +'" name="model" value="${obj.model }"\
							class="wd170 " ${disabled } maxlength="32" style="width: 100%;" />\
					</td>\
					<td>\
						<input type="text" id="num_'+ proI +'" name="num" onkeyup="getTotal('+ proI +')" value="${obj.num }"\
							class="wd170 " ${disabled } maxlength="32" style="width: 100%;" />\
					</td>\
					<td>\
						<input type="text" id="unitPrice_'+ proI +'" name="unitPrice"  onkeyup="getTotal('+ proI +')" value="${obj.unit_price }"\
							class="wd170 " ${disabled } maxlength="64" style="width: 100%;" />\
					</td>\
					<td>\
						<label id="total_'+ proI +'">${obj.total_price }</label>\
					</td>\
					<td>\
						<div class="del_icon" title="移除仪器" onclick="delPro('+ proI +')"></div>\
					</td>\
				</tr>';
        		
        		$("#equTable").append(_html);
        		proI++;
        		resetIdx();
        	}
        	
        	function delPro(idx){
        		$("#tr_"+idx).remove();
        		resetIdx();
        	}
        	
        	function resetIdx(){
        		var i = 1;
        		$(".proClass").each(function(){
        			var idx = $(this).attr("idx");
        			$("#xuhao_" + idx).html(i);
        			i++;
        		});
        	}
        	
        	function getTotal(idx){
        		var num = $('#num_'+idx).val();
        		if(!isEmpty(num)){
        			var number = /^[0-9]*$/;
        			if(!number.test(num)){
						parent.alertMsg('数量只能输入正整数','warning');
						$('#total_'+idx).html(0);
						$('#num_'+idx).val(0);
						return;
					}
        		}
        		var price = $('#unitPrice_'+idx).val();
        		if(!isEmpty(price)){
        			var money = /^[0-9]+(.[0-9]{2})?$/;
        			if(!money.test(price)){
						parent.alertMsg('单价格式有误','warning');
						$('#total_'+idx).html(0);
						$('#unitPrice_'+idx).val(0);
						return;
					}
        		}
        		var total = num * 1 * price * 1;
        		$('#total_'+idx).html(total);
        	}
        	function showCust(value){
        		if(value == 2){
        			$('#custTr').show();
        		}else{
        			$('#custTr').hide();
        		}
        	}
        </script>
  </body>
</html>